<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML>
<html>
<head>
	<base href="<%=basePath %>">
	<title>订单管理</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<%-- 引用layui.css --%>
	<link rel="stylesheet" type="text/css" href="<%=basePath %>js/layui/css/layui.css" />
	<link rel="stylesheet" type="text/css"href="<%=basePath %>css/common.css" />
</head>
<body>
<div class="ibox">
	<div class="ibox-content bodycss">
		<!-- 表单搜索 开始 -->
		<section class="panel panel-padding ">
			<form class="layui-form layui-form-pane form-search"
				  onsubmit="return false" method="get">
				<div class="layui-form-item layui-inline">
					<label class="layui-form-label">订单编号</label>
					<div class="layui-input-inline">
						<input name="orderSn" id="orderSn" value="" placeholder="请输入订单编号(tvn)"
							   class="layui-input">
					</div>
				</div>
				<div class="layui-form-item layui-inline">
					<label class="layui-form-label">会员名称</label>
					<div class="layui-input-inline">
						<input name="userName" id="userName" value="" placeholder="请输入会员名称"
							   class="layui-input">
					</div>
				</div>

				<div class="layui-form-item layui-inline">
					<label class="layui-form-label">会员卡号</label>
					<div class="layui-input-inline">
						<input name="userCardNumber" id="userCardNumber" value="" placeholder="请输入会员卡号"
							   class="layui-input">
					</div>
				</div>
				<div class="layui-form-item layui-inline">
					<label class="layui-form-label">会员电话</label>
					<div class="layui-input-inline">
						<input name="receiverPhone" id="receiverPhone" value="" placeholder="请输入会员电话"
							   class="layui-input">
					</div>
				</div>
				<div class="layui-form-item layui-inline">
					<label class="layui-form-label">订单状态</label>
					<div class="layui-input-inline">
						<div style="width:150px">
							<select name="orderState" id="orderState">
								<!-- 订单状态：0:已取消;10(默认):待确认;20:已确认;30:已配货;40:已发货;50:已收款;60:已退货 -->
								<option value="">请选择</option>
								<option value="0">已取消</option>
								<option value="10">待确认</option>
								<option value="20">已确认</option>
								<option value="30">已配货</option>
								<option value="40">已发货</option>
								<option value="50">已收款</option>
								<option value="60">已退货</option>
							</select>
						</div>
					</div>
				</div>
				<div class="layui-form-item layui-inline">
					<button class="layui-btn layui-btn-primary" lay-submit lay-filter="seach">
						<i class="layui-icon"></i> 搜 索
					</button>
				</div>
			</form>
		</section>
		<!-- 表单搜索 结束 -->
		<section class="panel panel-padding ">
			<c:if test="${sessionScope.userpopedom.ddgl03xcel eq '1' }"> <!-- pagecontext request session application -->
				<div class="ibox-toolbar">
					<button id="exportExcel" data-modal="" data-title="导出Excel"
							class="layui-btn layui-btn-sm">
						<i class="layui-icon">&#xe667;</i> 导出Excel
					</button>
				</div>
			</c:if>
			<table class="layui-table"
				   lay-data="{
	                        id: 'menuTeble',
	                        width:'auto',
	                        url:'order/list.do',
	                        page:true,
	                        even:true,
	                        skin:'row',
	                        limits:[10,20,30,40,50],
	                        limit:10}"
				   lay-filter="popedomLay">
				<thead>
				<tr>
					<th lay-data="{checkbox:true,disabledKey:'check_status',disabledKeyValue:'1,2'}"></th>
					<th lay-data="{type:'numbers', width:50}">序号</th>
					<!-- <th lay-data="{field:'orderId', width:120,align:'center'}">订单id</th> -->
					<th lay-data="{field:'orderSn', width:200,align:'center'}">订单编号</th>
					<th lay-data="{field:'userId', width:120,align:'center'}">用户id(tvn号)</th>
					<th lay-data="{field:'goodsName', width:120,align:'center'}">商品名称</th>
					<th lay-data="{field:'orderState', width:120,align:'center',templet:'#m_type'}">订单状态</th>
					<th lay-data="{field:'userName', width:120,align:'center'}">用户姓名</th>
					<th lay-data="{field:'goodsPrice', width:120,align:'center'}">商品单价(￥)</th>
					<th lay-data="{field:'goodsNum', width:100,align:'center'}">商品数量</th>
					<th lay-data="{field:'specifications', width:90,align:'center'}">商品规格</th>
					<th lay-data="{field:'orderAmount', width:120,align:'center'}">订单总价(￥)</th>
					<th lay-data="{field:'goodsType', width:120,align:'center',templet:'#goods_Type'}">商品属性</th>
					<th lay-data="{field:'areaName', width:200,align:'center'}">收货地址</th>
					<th lay-data="{field:'receiverPhone', width:120,align:'center'}">会员电话</th>
					<th lay-data="{field:'addTime', width:200,align:'center'}">订单生成时间</th>
					<th lay-data="{fixed: 'right', width:350, align:'center', toolbar: '#popedomBar'}">操作</th>
				</tr>
				</thead>
			</table>
		</section>
	</div>
</div>
<script type="text/html" id="goods_Type">
	<%--商品属性（0:正品;1:打折;2:体验;3:积分兑换;4:用来打包;5:打包品7:可兑换打包品)--%>
	{{#  if(d.goodsType == "0") {  }}
	<font color="#00ff00">正品</font>
	{{#  } else if(d.goodsType == "1") {  }}
	<font color="#ff0000">打折品</font>
	{{#  } else if(d.goodsType == "2") {  }}
	<font color="#ff0000">体验品</font>
	{{#  } else if(d.goodsType == "3") {  }}
	<font color="#ff0000">积分兑换品</font>
	{{#  } else if(d.goodsType == "4") {  }}
	<font color="#ff0000">用来打包品</font>
	{{#  } else if(d.goodsType == "5") {  }}
	<font color="#ff0000">打包品</font>
	{{#  } else if(d.goodsType == "7") {  }}
	<font color="#ff0000">可兑换打包品</font>
	{{#  }  }}

</script>
<script type="text/html" id="m_type">
	{{#  if(d.orderState == "0") {  }}
	<font color="#00ff00">已取消</font>
	{{#  } else if(d.orderState == "10") {  }}
	<font color="#ff0000">待确认</font>
	{{#  } else if(d.orderState == "20") {  }}
	<font color="#ff0000">已确认</font>
	{{#  } else if(d.orderState == "30") {  }}
	<font color="#ff0000">已配货</font>
	{{#  } else if(d.orderState == "40") {  }}
	<font color="#ff0000">已发货</font>
	{{#  } else if(d.orderState == "50") {  }}
	<font color="#ff0000">已收款</font>
	{{#  } else if(d.orderState == "60") {  }}
	<font color="#ff0000">已退货</font>
	{{#  }  }}
</script>
<script type="text/html" id="popedomBar">
	<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="yes">确认订单</a>
	<a class="layui-btn layui-bg-cyan layui-btn-xs"  lay-event="no">取消订单</a>
</script>
<script type="text/javascript" src="<%=basePath %>js/layui/layui.js"></script>
<script type="text/javascript">
	layui.config({
		base: "<%=basePath%>js/common/"
	}).use(["common", "element", "layer", "form", "table", "jquery"], function(){
		var elem = layui.element;
		var layer = layui.layer;
		var form = layui.form;
		var table = layui.table;
		var $ = layui.jquery;
		layui.common.init();
		/**
		 * 监听刷新表格
		 */
		form.on('submit(seach)', function(data){
			//console.log(JSON.stringify(data.field));
			table.reload('menuTeble', {
				where: data.field,
				page : {
					curr : 1
				}
			});
			return false;
		});
		
		
		
			//监听行工具事件
			table.on('tool(popedomLay)', function(obj) {
				var data = obj.data;
				var layEvent = obj.event;
				console.log(data);
				var id = data.orderId;
				console.log(obj.event);
	
				if (layEvent == "yes") {
					$.ajax({
						url : "order/updateState20.do",
						method : "post",
						data : {
							"orderId" : id
						},
						success : function(data1) {
							console.log(data1);
							if (data1.msg == "success") {
								table.reload('menuTeble', {
									where : data.field,
								//url : 'order/list.do'
								});
							}
						}
					});
					return false;
				} else if (layEvent == "no") {
					$.ajax({
						url : "order/updateState0.do",
						method : "post",
						data : {
							"orderId" : id
						},
						success : function(data2) {
							console.log(data2);
							if (data2.msg == "success") {
								table.reload('menuTeble', {
									where : data.field,
								//url : 'order/list.do'
								});
							}
						}
					});
					return false;
				}
			});
		
		
		
		
		
		
		
		
		
		
		
		
		
		//导出Excel
		$("#exportExcel").on("click", function(){
			layer.load(2, {time: 1000});
			window.location.href = "order/export.do?orderSn="+$("#orderSn").val()+"&userId="+$("#userId").val()+"&userName="+$("#userName").val()+"&orderState="+$("#orderState").val();
		});
	});
</script>
</body>
</html>
